<template>
	<view class="mar-top20">
		<view class="gridbox">
			<uni-grid :column="5" :showBorder="false" :square="false" @change="changegrid">
				<uni-grid-item v-for="(d, index) in list" :key="d.id" :index="index">
					<view class="item">
						<u--image :mode="'aspectFill'" :src="d.img" width="50rpx" height="50rpx"></u--image>
						<view class="text fs-24 mar-top16">
							<text>{{ d.name }}</text>
						</view>
					</view>
				</uni-grid-item>
			</uni-grid>
		</view>
	</view>
</template>

<script>
	export default {
		name:"uni-grids",
		props:{
			list:{
				type:Array,
				default:()=>[]
			}
		},
		data() {
			return {
			};
		},
		methods:{
			changegrid(e) {
				// this.$emit('gridChange',e.detail.index)
				let name = this.list[e.detail.index].name;
				if(this.title == name) return
				if (name == '画地块') {
					uni.navigateTo({
						url: '/subpkg/drawmaps/drawmaps'
					});
				} else if ((name == '种植管理')) {
					uni.navigateTo({
						url: '/subpkg/zhgl/zhgl'
					});
				} else if ((name == '巡田地')) {
					uni.navigateTo({
						url: '/subpkg/xuntd/xuntd-my'
					});
				}else if ((name == '物联监测')) {
					uni.navigateTo({
						url: '/subpkg/monitor/monitor'
					});
				}else if ((name == '管地基')) {
					uni.navigateTo({
						url: '/subpkg/foundation/foundation'
					});
				}else  {
					uni.showToast({
						title:'暂无数据',
						icon:'none'
					})
				}
			},
		}
	}
</script>

<style lang="scss">
.gridbox {
	// height: 140rpx;
	background: #fff;
	border-radius: 8rpx;
	// padding: 20rpx;
	margin: 0 30rpx 0;
	.item {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 140rpx;
		.text {
			color: #3e3e3e;
		}
	}
}
</style>